import React from 'react';
import {
  Card,
  Table,
  Button,
  Space,
  Dropdown,
  TableProps,
  CardProps
} from 'antd';
import {
  PlusOutlined,
  MoreOutlined
} from '@ant-design/icons';
import type { ColumnsType } from 'antd/es/table';
import type { TableRowSelection } from 'antd/es/table/interface';
import type { MenuProps } from 'antd';
import { useAdaptiveTableHeight } from '@/hooks/useAdaptiveTableHeight';

// 分页配置
export interface PaginationConfig {
  current: number;
  pageSize: number;
  total: number;
  showTotal?: (total: number) => string;
  showSizeChanger?: boolean;
  showQuickJumper?: boolean;
  onChange?: (page: number, pageSize?: number) => void;
}

// 工具栏动作配置
export interface ToolbarAction {
  key: string;
  label: string;
  icon?: React.ReactNode;
  type?: 'primary' | 'default' | 'dashed' | 'link' | 'text';
  onClick: () => void;
}

// 批量操作配置
export interface BatchAction {
  key: string;
  label: string;
  icon?: React.ReactNode;
  danger?: boolean;
  onClick: () => void;
}

// 组件Props
export interface DataTableProps<T = any> {
  // 表格相关
  columns: ColumnsType<T>;
  dataSource: T[];
  rowKey: string | ((record: T) => string);
  loading?: boolean;
  scroll?: { x?: number; y?: number };
  
  // 分页相关
  pagination: PaginationConfig;
  
  // 行选择相关
  rowSelection?: {
    selectedRowKeys: React.Key[];
    onChange: (keys: React.Key[]) => void;
    getCheckboxProps?: (record: T) => any;
  };
  
  // 工具栏相关
  title?: string;
  toolbarActions?: ToolbarAction[];
  batchActions?: BatchAction[];
  
  // 自适应高度相关
  adaptiveHeight?: boolean;
  heightOptions?: {
    offset?: number;
    minHeight?: number;
    maxHeight?: number;
    fixedElements?: {
      header?: number;
      searchForm?: number;
      toolbar?: number;
      pagination?: number;
      margins?: number;
    };
  };
  
  // 卡片相关
  cardProps?: CardProps;
  className?: string;
}

const DataTable = <T extends Record<string, any>>({
  // 表格相关
  columns,
  dataSource,
  rowKey,
  loading = false,
  scroll,
  
  // 分页相关
  pagination,
  
  // 行选择相关
  rowSelection,
  
  // 工具栏相关
  title,
  toolbarActions = [],
  batchActions = [],
  
  // 自适应高度相关
  adaptiveHeight = false,
  heightOptions,
  
  // 卡片相关
  cardProps,
  className = ''
}: DataTableProps<T>) => {
  // 自适应高度Hook
  const { tableHeight } = useAdaptiveTableHeight(
    adaptiveHeight ? heightOptions : undefined
  );
  // 构建表格的行选择配置
  const tableRowSelection: TableRowSelection<T> | undefined = rowSelection ? {
    selectedRowKeys: rowSelection.selectedRowKeys,
    onChange: rowSelection.onChange,
    getCheckboxProps: rowSelection.getCheckboxProps,
  } : undefined;

  // 构建批量操作菜单
  const batchActionItems: MenuProps['items'] = batchActions.map(action => ({
    key: action.key,
    label: action.label,
    icon: action.icon,
    danger: action.danger,
    onClick: action.onClick,
  }));

  // 构建工具栏额外内容
  const renderExtra = () => {
    const elements: React.ReactNode[] = [];
    
    // 添加工具栏动作按钮
    toolbarActions.forEach(action => {
      elements.push(
        <Button
          key={action.key}
          type={action.type || 'default'}
          icon={action.icon}
          onClick={action.onClick}
        >
          {action.label}
        </Button>
      );
    });
    
    // 添加批量操作按钮
    if (batchActions.length > 0 && rowSelection) {
      const selectedCount = rowSelection.selectedRowKeys.length;
      elements.push(
        <Dropdown
          key="batch-actions"
          menu={{ items: batchActionItems }}
          disabled={selectedCount === 0}
        >
          <Button icon={<MoreOutlined />}>
            批量操作 ({selectedCount})
          </Button>
        </Dropdown>
      );
    }
    
    return elements.length > 0 ? <Space>{elements}</Space> : null;
  };

  // 表格的分页配置
  const tablePagination = {
    current: pagination.current,
    pageSize: pagination.pageSize,
    total: pagination.total,
    showTotal: pagination.showTotal || ((total: number) => `共 ${total} 条记录`),
    showSizeChanger: pagination.showSizeChanger !== false,
    showQuickJumper: pagination.showQuickJumper !== false,
    onChange: pagination.onChange,
  };

  // 表格滚动配置
  const tableScroll = adaptiveHeight 
    ? { ...scroll, y: tableHeight }
    : scroll;

  return (
    <Card
      title={title}
      extra={renderExtra()}
      className={className}
      {...cardProps}
    >
      <Table<T>
        rowKey={rowKey}
        columns={columns}
        dataSource={dataSource}
        loading={loading}
        pagination={tablePagination}
        rowSelection={tableRowSelection}
        scroll={tableScroll}
      />
    </Card>
  );
};

export default DataTable; 